import { useEffect } from 'react'
import AMapLoader from '@amap/amap-jsapi-loader'

export default function Baidu () {
  let map:any = null

  useEffect(() => {
    AMapLoader.load({
      key: 'b5a3290bb8e23f2361bcc36be9435bcd', // 申请好的Web端开发者Key，首次调用 load 时必填
      version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
      plugins: [] // 需要使用的的插件列表，如比例尺'AMap.Scale'等
    })
      .then(AMap => {
        map = new AMap.Map('container', {
          // 设置地图容器id
          viewMode: '3D', // 是否为3D地图模式
          zoom: 11, // 初始化地图级别
          center: [113.84,22.59] // 初始化地图中心点位置
        })
      })
      .catch(e => {
        console.log(e)
      })

    return () => {
      map?.destroy()
    }
  }, [])

  return <div id='container' style={{ width: '90%', height: '90%' }}></div>
}
